<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        .guanggao {
            width: 100px;
            height: 100px;
            background-color: red;
        }

        .hour,
        .minute,
        .second {
            background-color: black;
            text-align: center;
            line-height: 40px;
            color: white;
            float: left;
            width: 40px;
            height: 40px;
            margin: 5px;
        }
    </style>
</head>

<body>
    <div class="guanggao"></div>
    <input type="text" value="请输入手机号"> <button>发送</button>
    <div>
        <div class="hour">00</div>
        <div class="minute">00</div>
        <div class="second">00</div>
    </div>

</body>
<script>
    var guanggao = document.querySelector('.guanggao');
    var timer = setTimeout(function () {
        guanggao.style.display = 'none';
    }, 5000);
    var but = document.querySelector("button");
    var time = 5;
    but.addEventListener('click', function () {
        but.disabled = true;
        var timer2 = setInterval(function () {
            if (time > 0) {
                but.innerHTML = '重新发送剩余' + time + '秒';
                time--;
            } else {
                clearInterval(timer2);
                but.disabled = false;
                but.innerHTML = '发送';
                time = 5;
            }
        }, 1000);
    })
    var hour = document.querySelector('.hour');
    var minute = document.querySelector('.minute');
    var second = document.querySelector('.second');
    var timeNow = +new Date('2023-1-29 15:30:40');
    conutDown();
    var timer3 = setInterval(conutDown, 1000);
    function conutDown() {
        var nowTime = +new Date();
        var times = (timeNow - nowTime) / 1000;
        if (times <= 0) {
            clearInterval(timeer3);
        }
        var h = parseInt(times / 60 / 60 % 24);
        h = h < 10 ? '0' + h : h;
        hour.innerHTML = h;
        var m = parseInt(times / 60 % 60);
        m = m < 10 ? '0' + m : m;
        minute.innerHTML = m;
        var s = parseInt(times % 60);
        s = s < 10 ? '0' + s : s;
        second.innerHTML = s;
    }
</script>

</html>